body {
    margin: 0;
}

a {
    text-decoration: none;
}

.button-remove {
    --size: 20px;
    background-size: var(--size);
    background-repeat: no-repeat;
    background-position: center;
    background-image: url('remove_icon.png');
    background-color: red;
    border-color: darkred;
    padding: 15px;
    color: white;
}

.button-remove:hover {
    background-image: url('remove_icon_hover.png');
    color: darkred;
}

@media(min-width: 700px) {

    .image img {
        width: 237px;
        height: 262px;
        margin: auto;
    }

    .head {
        height: 72px;
        background-color: #C9C9C9;
        padding-top: 10px;
    }

    .head .container {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 700px;
        margin: auto;
    }

    .head .logo {
        height: 60px;
        width: 180px;
        background-image: url("../logos/logo_short.png");
        background-size: cover;
    }

    .head .account {
        display: flex;
        flex-direction: row;
        gap: 10px;
    }

    .head .user-icon {
        height: 62px;
        width: 62px;
        background-image: var(--icon-url);
        background-size: contain;
    }

    .head .username {
        font-size: 23px;
        font-weight: bold;
        margin: auto;
    }

    .content {
        width: 700px;
        margin: 100px auto;
    }
}

@media(min-width: 1024px) {

    .content {
        width: 900px;
    }
}

.editor-bar .button-save-changes {
    margin: 15px 0 0;
}